<template>
  <div id="app">
    <h1>父组件</h1>
    <Son
      :aaa="aaa"
      :name1="name1"
      :name2="name2"
      :name3="name3"
      :name4="name4"
      @todo="todo"
      @change="change"
    />
    <button @click="change">改变msg</button>
  </div>
</template>

<script>
import Son from "./components/Son";
/* $attrs 包含不被props接收的属性（class style除外）
 v-bind="$attrs"传入
 $listeners 包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器  this.$listeners获取 对象
 eg:@click="4listeners.todo"
*/
export default {
  name: "App",
  data() {
    return {
      aaa: "app",
      name1: "html+css",
      name2: "js",
      name3: "ajax",
      name4: "cs3+h5"
    };
  },
  inheritAttrs: false,
  components: {
    Son
  },
  mounted() {},
  methods: {
    change() {
      console.log(this.aaa);
    },
    todo() {
      console.log("吃饭");
    }
  }
};
</script>

<style></style>
